<template>
  <div class="home">
    <header-top></header-top>
    <div class="slider">
      <yd-slider autoplay="3000">
        <yd-slider-item>
            <a href="http://www.ydcss.com">
                <img src="http://static.ydcss.com/uploads/ydui/1.jpg">
            </a>
        </yd-slider-item>
        <yd-slider-item>
            <a href="http://www.ydcss.com">
                <img src="http://static.ydcss.com/uploads/ydui/2.jpg">
            </a>
        </yd-slider-item>
        <yd-slider-item>
            <a href="http://www.ydcss.com">
                <img src="http://static.ydcss.com/uploads/ydui/3.jpg">
            </a>
        </yd-slider-item>
      </yd-slider>
    </div>
    <div>
      <yd-grids-group :rows="4">
        <yd-grids-item>
          <img slot="icon" src="http://static.ydcss.com/ydui/img/logo.png">
          <span slot="text">你好</span>
        </yd-grids-item>
        <yd-grids-item>
          <yd-icon slot="icon" name="home" color="#FF685D"></yd-icon>
          <span slot="text">你好</span>
        </yd-grids-item>
        <yd-grids-item>
          <img slot="icon" src="http://static.ydcss.com/ydui/img/logo.png">
          <span slot="text">你好</span>
        </yd-grids-item>
        <yd-grids-item>
          <yd-icon slot="icon" name="home" color="#FF685D"></yd-icon>
          <span slot="text">你好</span>
        </yd-grids-item>
        <yd-grids-item>
          <img slot="icon" src="http://static.ydcss.com/ydui/img/logo.png">
          <span slot="text">你好</span>
        </yd-grids-item>
        <yd-grids-item>
          <yd-icon slot="icon" name="home" color="#FF685D"></yd-icon>
          <span slot="text">你好</span>
        </yd-grids-item>
        <yd-grids-item>
          <img slot="icon" src="http://static.ydcss.com/ydui/img/logo.png">
          <span slot="text">你好</span>
        </yd-grids-item>
        <yd-grids-item>
          <yd-icon slot="icon" name="home" color="#FF685D"></yd-icon>
          <span slot="text">你好</span>
        </yd-grids-item>
      </yd-grids-group>
    </div>
  </div>
</template>

<script>
import HeaderTop from '../header/Header'
export default {
  components: {
    HeaderTop
  }
}
</script>

<style lang="scss">
  .slider{
    margin-top: 0.8rem;
    .yd-slider-wrapper{
      height: 3rem;
    }
    .yd-slider-pagination-item-active{
      background-color: #0078de;
    }
  }
</style>
